<template>
  <div>
    <div class="ly-btn-list">
      <el-button type="primary" size="small" @click="$router.push('/addBanner')">新增banner</el-button>
    </div>
    <div class="ly-table">
      <el-table :data="tableData" style="width: 100%" border>
        <el-table-column fixed prop="id" label="序号" width="100"></el-table-column>
        <el-table-column fixed prop="appType" label="类型" width="200">
          <template slot-scope="scope">
            <span v-if="tableData[scope.$index].appType===1">小程序</span>
            <span v-else-if="tableData[scope.$index].appType===11">PC首页</span>
            <span v-else-if="tableData[scope.$index].appType===12">PC服务项目</span>
            <span v-else-if="tableData[scope.$index].appType===13">PC商学院</span>
            <span v-else-if="tableData[scope.$index].appType===14">PC新闻资讯</span>
            <span v-else-if="tableData[scope.$index].appType===15">PC联系我们</span>
            <span v-else class="ly-blue">PC端</span>
          </template>
        </el-table-column>
        <el-table-column prop="bannerUrl" label="图片">
          <template slot-scope="scope">
            <img class="ly-img" :src="tableData[scope.$index].bannerUrl"/>
          </template>
        </el-table-column>
        <!--        <el-table-column prop="link" label="链接"></el-table-column>-->
        <el-table-column fixed="right" label="操作" width="160">
          <template slot-scope="scope">
            <el-button size="mini" @click="getDelete(tableData[scope.$index].id)">删除</el-button>
          </template>
        </el-table-column>
      </el-table>
    </div>
  </div>
</template>

<script>
  import {findAll, bannerDelete} from "@/api/banner"

  export default {
    name: "banner",
    data() {
      return {
        tableData: []
      }
    },
    created() {
      this.findAllBanner()

    },
    methods: {
      // 删除
      getDelete(val) {
        let data = val
        bannerDelete(data).then(response => {
          console.log(response)
          let result = response.data
          if (result.code === '0000') {
            this.$message.success(result.msg)
            this.findAllBanner()
          } else {
            this.$message.error(result.msg)
          }
        })
      },
      // 所有的banner
      findAllBanner() {
        let data = {
          appType: -1
        }
        findAll(data).then(response => {
          console.log(response)
          let result = response.data
          if (result.code === '0000') {
            this.tableData = result.data
          }
        })
      }
    }
  }
</script>

<style scoped lang="scss">

</style>